<v-bottom-sheet v-model="show">
  <v-card text style="margin: auto">
    <v-container fluid grid-list-md text-xs-center :style="{width:size * 8 + 'px'}">
      <v-layout row wrap style="padding-bottom: 5%;">
        <v-flex xs12 style="display: flex;">
          <v-btn
            :color="context.mode == 0?'primary':''"
            depressed
            style="text-transform:none; min-width: 0%; min-height: 0%; margin: 0%; padding: 0%; flex: 1"
            @click="tap('playground')"
            :style="{height: size * 0.9 + 'px'}"
          >
            <v-icon :size="size * 0.8">games</v-icon>
          </v-btn>
          <v-btn
            :color="context.mode == 1?'primary':''"
            depressed
            style="text-transform:none; min-width: 0%; min-height: 0%; margin: 0%; padding: 0%; flex: 1"
            @click="tap('algs')"
            :style="{height: size * 0.9 + 'px'}"
          >
            <v-icon :size="size * 0.8">school</v-icon>
          </v-btn>
          <v-btn
            :color="context.mode == 2?'primary':''"
            depressed
            style="text-transform:none; min-width: 0%; min-height: 0%; margin: 0%; padding: 0%; flex: 1"
            @click="tap('director')"
            :style="{height: size * 0.9 + 'px'}"
          >
            <v-icon :size="size * 0.8">movie</v-icon>
          </v-btn>
        </v-flex>
      </v-layout>
      <v-layout row wrap style="padding-bottom: 5%;">
        <v-flex>
          <v-btn class="headline" text block @click="tap('tune')" style="margin: 0%; padding: 0%;">
            <v-icon :size="size * 0.6">tune</v-icon>
          </v-btn>
        </v-flex>
        <v-flex>
          <v-btn class="headline" text block @click="tap('code')" style="margin: 0%; padding: 0%;">
            <v-icon :size="size * 0.6">code</v-icon>
          </v-btn>
        </v-flex>
        <v-flex>
          <v-btn class="headline" color="error" text block @click="resetd=true" style="margin: 0%; padding: 0%;">
            <v-icon :size="size * 0.6">delete</v-icon>
          </v-btn>
        </v-flex>
      </v-layout>
    </v-container>
  </v-card>
  <tune v-model="tune"></tune>
  <v-dialog v-model="resetd">
    <v-card>
      <v-card-title style="text-transform:none;" class="headline">重置数据?</v-card-title>
      <v-card-actions>
        <v-spacer></v-spacer>
        <v-btn color="red" text @click="resetd=false;reset()">
          确定
        </v-btn>
        <v-btn color="black" text @click="resetd=false">
          取消
        </v-btn>
      </v-card-actions>
    </v-card>
  </v-dialog>
</v-bottom-sheet>
